<template>
	<el-container>
		<el-header>修改密码</el-header>
		<el-main>
			<el-row :gutter="20">
				<el-col :span="24">
					<div class="grid-content1 bg-purple"></div>
				</el-col>
			</el-row>	
			<el-row :gutter="20">
				<el-col :span="10">
					<div class="grid-content bg-purple" align="right">手机号：</div>
				</el-col>
				<el-col :span="8">
					<div class="grid-content bg-purple" align="center">
						<el-input  placeholder="请输入手机号" v-model="test.tel" show-password></el-input>
					</div>
				</el-col>
			</el-row>
			<el-row :gutter="20">
				<el-col :span="10">
					<div class="grid-content bg-purple" align="right">旧密码：</div>
				</el-col>
				<el-col :span="8">
					<div class="grid-content bg-purple" align="center">
						<el-input  placeholder="请输入旧密码" v-model="test.password" show-password></el-input>
					</div>
				</el-col>
			</el-row>
			<el-row :gutter="20">
				<el-col :span="10">
					<div class="grid-content bg-purple" align="right">新密码：</div>
				</el-col>
				<el-col :span="8">
					<div class="grid-content bg-purple" align="center">
						<el-input  placeholder="请输入新密码" v-model="test.newpassword" show-password></el-input>
					</div>
				</el-col>
			</el-row>
			<el-row :gutter="20">
				<el-col :span="24">
					<div class="grid-content bg-purple">
						<el-button :plain="true" @click="open1">确定</el-button>
					</div>
					
				</el-col>
				<el-col :span="18">
					<div class="grid-content bg-purple">
						
						<router-link to="/retrieve_password">忘记密码？</router-link>
					</div>
					
				</el-col>
				
			</el-row>
		</el-main>
		<el-footer>
			<el-row :gutter=" 20">
				<el-col :span="4">
					<div class="grid-content bg-purple1">
						<el-button>返回登录界面</el-button>
					</div>
				</el-col>
				<el-col :span="16">
					<div class="grid-content bg-purple1" align="center"></div>
				</el-col>
				<el-col :span="4">
					<div class="grid-content bg-purple1">
					</div>
				</el-col>
			</el-row>
		</el-footer>
	</el-container>
</template>

<script>
	import {
		showMsgTitle
	} from '@/utils/api2'
	import {
		showMsgConfirm
	} from '@/utils/api2'
	import {
		getRequest
	} from '@/utils/api2'
	import {
		postRequest
	} from '@/utils/api2'
	
	export default {
		data() {
			return {
				test:{
				tel:'',
				password: '',
				newpassword: ''}
			}
		},
		// mounted: function() {
		// 	let url = "/doctor/test";
		// 	let _this = this;
		// 	getRequest(url).then(resp => {
		// 		if (resp.status == 200) {
		// 			//alert(resp.data);
		// 			_this.test = resp.data;
		// 		} else {
		// 			_this.$message({
		// 				type: 'error',
		// 				message: '数据加载失败!'
		// 			});
		// 		}
		// 	}, resp => {
		// 		_this.loading = false;
		// 		if (resp.response.status == 403) {
		// 			_this.$message({
		// 				type: 'error',
		// 				message: resp.response.data
		// 			});
		// 		} else {
		// 			_this.$message({
		// 				type: 'error',
		// 				message: '数据加载失败!'
		// 			});
		// 		}
		// 	}).catch(resp => {
		// 		//压根没见到服务器
		// 		_this.loading = false;
		// 		_this.$message({
		// 			type: 'error',
		// 			message: '数据加载失败!'
		// 		});
		// 	});
		// 	// this.axios.get('/api/user/allUser')
		// 	// 	.then(res => {
		// 	// 		this.tableData = res.data;
		// 	// 	})
		// 	// 	.catch(function(error) {
		// 	// 		console.log(error);
		// 	// 	});
		// },
		methods: {
			open1() {
				
				let url = "/queryPatient";
				getRequest(url).then(resp => {
					//postRequest('/updataPatient', this.test);
						for (var i = 0; i < resp.data.length; i++) {

							if (this.test.tel == resp.data[i].tel&&this.test.password == resp.data[i].password) {
								resp.data[i].password=this.test.newpassword;
								postRequest('/updataPatient', resp.data[i]);								
							}
						}
				})
				this.$message({
					showClose: true,
					message: '修改成功！',
					type: 'success'
				});
				this.$router.push({
					path: '/',
					replace: true
				});
			}
		}
	}
</script>
<style>
	.el-footer {
		background-color: #4FC1B0;
		color: #333;
		text-align: center;
		line-height: 60px;
		border-radius: 10px;
	}

	.el-header {
		text-align: left;
		font-size: 40px;
		color: #ffffff;
		border-radius: 10px;
		background-color: #4FC1B0;
	}

	.el-main {
		background-color: #ffffff;
		color: #333;
		text-align: center;
		height: 610px;
	}

	.el-row {
		margin-bottom: 20px;

		&:last-child {
			margin-bottom: 0;
		}
	}

	.el-col {
		border-radius: 4px;
	}


	.bg-purple {
		background: #ffffff;
	}

	.bg-purple1 {
		background: #4FC1B0;
	}

	.grid-content {
		border-radius: 4px;
		min-height: 50px;
		font-size: 24px;
	}

	.grid-content1 {
		border-radius: 4px;
		min-height: 160px;

	}
</style>
